import React, { memo, useState } from 'react'
import { connect } from 'react-redux'
import Scroll from '../../baseUI/scroll/index'
import './Msg.css'
import MsgHead from '../../components/msg/msgHead/MsgHead'
import Classify1 from '../../components/msg/classify1/Classify1'
import Classify2 from '../../components/msg/classify2/Classify2'
import Classify3 from '../../components/msg/classify3/Classify3'
import MsgPopup from '../../components/msg/msgHead/msgPopup/MsgPopup'
import MsgClear from '../../components/msg/msgClear/MsgClear'


const Msg = (props) => {
    const { } = props
    const [msgDisplay, setMsgDisplay] = useState(false)
    const handleonclick = () => {
        // console.log('-------------------------')
        setMsgDisplay(!msgDisplay)
    }
    return (
        <>
            <div className="msg-main">
                <MsgPopup
                    display={msgDisplay}
                    handleOnclick={handleonclick}
                />
                <MsgHead handlenOnclick={handleonclick}/>
                <MsgClear />
                <Classify1 />
                <Classify2 />
                <Classify3 />
            </div>
        </>
    )
}

const mapStateToProps = (state) => {
    return {
    }
}
export default connect(mapStateToProps, {})(memo(Msg))